@charset "utf-8";

footer{
  margin-top: 60px;
  height: 248px;
  font-size: 12px;
  color: #999;
  background-color: #fff;
  .mz-footer{
    padding: 40px 0 20px;
    .mz-footer-link{
      li{
        a{
          display: block;
          width: 150px;
          height: 69px;
          img{
            display: block;
            margin: 0 auto;
            width: 50px;
          }
          p{
            color: #999;
            text-align: center;
          }
        }
      }
      .mz-info{
        .mz-tel{
          margin: 10px 0;
          color: #008cff;
          font-size: 25px;
        }
        a{
          position: relative;
          left: 80px;
          width: 88px;
          height: 33px;
          line-height: 33px;
          background: #008cff;
          font-size: 14px;
          color: #fff;
          border-radius: 20px;
        }
      }
    }
    .mz-copyright{
      position: relative;
      >ul{
        >li{
          margin-right: 15px;
          padding-right: 15px;
          border-right: 1px solid #999;
          line-height: 18px;
          a{
            color: #999;
            &:hover{
              text-decoration: none;
            }
          }
          &.mz-lang{
            position: relative;
            .mz-flag{
              margin-right: 5px;
              width: 18px;
              height: 18px;
              background: url("../images/flag.png") no-repeat center top/cover;
            }
            .mz-flag-box{
              transform: translateY(-10px);
              display: none;
              position:absolute;
              left: -10px;
              bottom: 6px;
              padding: 0 5px 11px 10px;
              width: 115px;
              background-color: #fff;
              li{
                height: 37px;
                line-height: 37px;
                .mz-flag{
                  vertical-align: -5px;
                }
                .fz{
                  background-position: 0 -18px!important;
                }
                .en{
                  background: url("../images/flag-en.png") no-repeat center/cover;
                }
                .py{
                  background-position: 0 -72px!important;
                }
                .tu{
                  background-position: 0 -307px!important;
                }
              }
            }
            &:hover .mz-flag-box{
              display: block;
            }
          }
        }
      }
      
      .mz-co-info{
        margin-top: 8px;
        a{
          color: #999;
          &:last-child{
            i{
              display: inline-block;
              width: 14px;
              height: 18px;
              background: url("../images/gongan.png") no-repeat center/cover;
              vertical-align: -6px;
            }
          }
          &:hover{
            color: #008cff;
            text-decoration: none;
          }
        }
      }
      .mz-link-icon{
        position: absolute;
        right: 0;
        bottom: 0;
        li{
          margin-right: 11px;
          padding-right: 11px;
          a{
            position: relative;
            display: block;
            width: 18px;
            height: 18px;
            &.mz-xcx{
              background: url("../images/xiaochengxu.png") no-repeat center/cover;
              &+.mz-xcx-link{
                img{
                  left: -5px;
                }
              }
              &:hover +div img{
                display: block;
              }
            }
            &.mz-weixin{
              background: url("../images/weixin.png") no-repeat center/cover;
              &+.mz-weixin-link{
                img{
                  left: -15px;
                }
              }
              &:hover +div img{
                display: block;
              }
            }
            &.mz-qq{
              background: url("../images/qqkongjian.png") no-repeat center/cover;
            }
            &.mz-weibo{
              background: url("../images/weibo.png") no-repeat center/cover;
            }
            &:hover{
              text-decoration: none;
            }
          }
          >div{
            img{
              display: none;
              position: absolute;
              bottom: 21px;
              width: 180px;
              height: 180px;
            }
          }
        }
      }
    }
  }
}